/**
 * Responsive default scale
 * 		xs: < 768px,  //Mobile
 * 		sm: >= 768px, //Tablet
 * 		md: >= 960px, //PC middle - As design, the scale of page content is limited to 960px; (not 992px)
 * 		lg: >= 1200px //PC big- As design, dont needs this breakpoint at present stage.
 */
 @page-sm-breakpoint-width-max:  767px;

 @page-md-breakpoint-width-min:  (@page-sm-breakpoint-width-max + 1);
 @page-md-breakpoint-width-max:  959px;

 @page-lg-breakpoint-width-min:  (@page-md-breakpoint-width-max + 1);

 @media-query-small: ~"screen and (max-width: @{page-sm-breakpoint-width-max})";
 @media-query-medium: ~"screen and (min-width: @{page-md-breakpoint-width-min}) and (max-width: @{page-md-breakpoint-width-max})";
 @media-query-large: ~"screen and (min-width: @{page-lg-breakpoint-width-min})";
